import React, { Component } from 'react'

class App extends Component {
	state = {
        person = {
            name:'张三',
            age:20,
            job:'waiter'
        }
    }

    componentDidMount(){
        setTimeout(()=>{
            // 即使页面只展示 name age ，修改了job 也会重新渲染组件
            this.setState({
                person:{
                    ...this.state.person,job:'chef'
                }
            })
        },2000)
    }

    // name 或者 age 没有变化 组件不重新渲染
    shouldComponentUpdate(nextProps,nextState){
      if(nextState.person.name!== this.state.person.name || nextState.person.age !== this.state.person.age){
          return true
      }else {
          return false
      }
    }

	render() {
        console.log('render');
        let { name,age} = this.state
		return <div>{name} {age}</div>
	}
}

export default App
